<#include "/layout/layout.ftl">
<#import "/layout/macro.ftl" as macro>
<#assign css>
<link rel="stylesheet" href="/assets/vendor/bootstrap-datepicker/css/bootstrap-datepicker3.css">

<style>
</style>
</#assign>
<#assign js>
<script src="/assets/vendor/chart.js/Chart.min.js"></script>
<script src="/assets/js/dashboard.js"></script>
<script src="/assets/vendor/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="/assets/vendor/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js" charset="UTF-8"></script>

<script>

    $(function(){
        //Date picker
        $('#startDate').datepicker({
            autoclose: true,
            format:"yyyy-mm-dd",
            todayHighlight:true,
            language:"zh-CN"
        });
        $('#endDate').datepicker({
            autoclose: true,
            format:"yyyy-mm-dd",
            todayHighlight:true,
            language:"zh-CN"
        });
        $('#startDate').unbind("change");
        $('#startDate').change(function(){
            $('#endDate').datepicker('setStartDate', $("#startDate").val());
        });
        $('#endDate').unbind("change");
        $('#endDate').change(function(){
            $('#startDate').datepicker('setEndDate', $("#endDate").val());
        });

    })


</script>
</#assign>
<@layout title="分站财务总览" active="agentDetail">
<!-- Content Header (Page header) -->
<section class="content-header">
    <h1>
        分站财务总览
        <small></small>
    </h1>
    <ol class="breadcrumb">
        <li><a href="/"><i class="fa fa-home"></i> 管理后台</a></li>
        <li class="active"> 分站财务总览</li>
    </ol>
</section>

<section class="content">
    <div class="row">
        <div class="col-md-3 col-sm-6 col-xs-12">
            <div class="info-box">
                <span class="info-box-icon bg-aqua"><i class="fa fa-usd"></i></span>

                <div class="info-box-content">
                    <span class="info-box-text">总交易额</span>
                    <span class="info-box-number"  style="font-size: 3em">${total.totalAmt?string('0.00')!}</span>
                </div>
            </div>
        </div>
        <div class="col-md-3 col-sm-6 col-xs-12">
            <div class="info-box">
                <span class="info-box-icon bg-green"><i class="fa fa-usd"></i></span>

                <div class="info-box-content">
                    <span class="info-box-text">总利润</span>
                    <span class="info-box-number" style="font-size: 3em">${total.totalProfit?string('0.00') !}</span>
                </div>
            </div>
        </div>
        <div class="col-md-3 col-sm-6 col-xs-12">
            <div class="info-box">
                <span class="info-box-icon bg-green"><i class="fa fa-usd"></i></span>

                <div class="info-box-content">
                    <span class="info-box-text">账户余额</span>
                    <span class="info-box-number" style="font-size: 3em">${total.balance?string('0.00') !}</span>
                </div>
            </div>
        </div>


    </div>
    <div class="row">
        <div class="col-md-12">
            <form class="form-horizontal form-edit" method="post" action="/agentAccountDetail/index" id="form">
                <div class="form-group">
                    <#--<div class="col-sm-2">
                        <div class="input-group date">

                            <input type="text" placeholder="分站名称" name="agentId" class="form-control pull-right" id="agentName" value="${query.agentId!}">
                        </div>
                    </div>-->

                    <div class="col-sm-2">
                        <div class="input-group date">
                            <div class="input-group-addon">
                                <i class="fa fa-calendar"></i>
                            </div>
                            <input type="text" placeholder="开始日期" name="startDate" class="form-control pull-right" id="startDate" value="${query.startDate!}">
                        </div>
                    </div>
                    <div class="col-sm-2">
                        <div class="input-group date">
                            <div class="input-group-addon">
                                <i class="fa fa-calendar"></i>
                            </div>
                            <input type="text" placeholder="结束日期" name="endDate" class="form-control pull-right" id="endDate" value="${query.endDate!}">
                        </div>
                    </div>

                    <div class="col-sm-2 btn-group">
                        <button type="submit" class="btn btn-primary" data-btn-type="search">查询</button>
                        <button type="button" class="btn btn-default" data-btn-type="reset" onclick="javascript:$('#form')[0].reset();">重置</button>
                    </div>
                </div>

            </form>
        </div>
    </div>

    <div class="row" style="display: none;">


        <div class="col-md-12">
            <div class="box">
                <div class="box-header with-border">
                    <h3 class="box-title">财务数据总览</h3>

                    <div class="box-tools pull-right">
                        <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
                        </button>

                    </div>
                </div>
                <!-- /.box-header -->
                <div class="box-body">
                    <div class="row">
                        <div class="col-md-12">
                            <p class="text-center">
                                <strong>Sales: 1 Jan, 2014 - 30 Jul, 2014</strong>
                            </p>

                            <div class="chart">
                                <!-- Sales Chart Canvas -->
                                <canvas id="salesChart" style="height: 180px;"></canvas>
                            </div>
                            <!-- /.chart-responsive -->
                        </div>
                        <!-- /.col -->
                    <#--<div class="col-md-4">
                        <div class="col-md-8">
                            <div class="chart-responsive">
                                <canvas id="pieChart" height="150"></canvas>
                            </div>
                            <!-- ./chart-responsive &ndash;&gt;
                        </div>
                        <!-- /.col &ndash;&gt;
                        <div class="col-md-4">
                            <ul class="chart-legend clearfix">
                                <li><i class="fa fa-circle-o text-red"></i> 帮我取</li>
                                <li><i class="fa fa-circle-o text-green"></i> 帮我送</li>
                                <li><i class="fa fa-circle-o text-yellow"></i> 随意购</li>
                                <li><i class="fa fa-circle-o text-aqua"></i> 技术服务</li>
                            </ul>
                        </div>
                            <!-- /.col &ndash;&gt;
                        <!-- /.progress-group &ndash;&gt;
                    </div>-->
                        <!-- /.col -->
                    </div>
                    <!-- /.row -->
                </div>
                <!-- ./box-body -->
                <div class="box-footer">
                    <div class="row">
                        <div class="col-sm-6 col-xs-6">
                            <div class="description-block border-right">
                                <h5 class="description-header">35,210.43</h5>
                                <span class="description-text">总交易额</span>
                            </div>
                            <!-- /.description-block -->
                        </div>
                        <!-- /.col -->
                        <div class="col-sm-6 col-xs-6">
                            <div class="description-block border-right">
                                <h5 class="description-header">10,390.90</h5>
                                <span class="description-text">总利润</span>
                            </div>
                            <!-- /.description-block -->
                        </div>

                    </div>
                    <!-- /.row -->
                </div>
                <!-- /.box-footer -->
            </div>
            <!-- /.box -->
        </div>
        <!-- /.col -->


    </div>

    <div class="row">


        <div class="col-md-12">
            <div class="box">
                <div class="box-header with-border">
                    <h3 class="box-title">财务明细数据</h3>

                    <div class="box-tools pull-right">
                        <button type="button" class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i>
                        </button>

                    </div>
                </div>
                <div class="box-body">
                    <table class="table table-striped">
                        <tr>
                            <th></th>
                            <th>交易时间</th>
                            <th>交易类型</th>
                            <th>收支标志</th>
                            <th>金额</th>
                            <th>账户余额</th>
                            <th>交易描述</th>
                            <#--<th>订单号</th>-->

                        </tr>
						<#list pageInfo.list as item>
						<tr>
                            <td >${item.id!}</td>
                            <td >${(item.tranTime?string('yyyy-MM-dd HH:mm:ss'))!}</td>
                            <td ><#--${tranType[item.tranType]!}-->
                                <#if item.tranType== '1'>
                                    订单抽成
                                <#elseif item.tranType=='2'>
                                    保费收入
                                <#elseif item.tranType=='3'>
                                    手续费收入
                                <#else>
                                    提现
                                </#if>
                            </td>
                            <td >
                                <#if item.inOut == '1'>
                                    <span class="label label-success">收入</span>
                                <#else>
                                    <span class="label label-danger">支出</span>
                                </#if>

                            </td>
                            <td >${item.amount?string('0.00')!}</td>
                            <td >${item.tranBal?string('0.00')!}</td>
                            <td >${item.tranDesc!}</td>
                            <#--<td >${item.orderNo!}</td>-->

                        </tr>
                        </#list>
                    </table>
                </div>
                <div class="box-footer clearfix">
            		<@macro.page pageInfo=pageInfo url="/agentAccountDetail/index?startDate=${query.startDate!}&endDate=${query.endDate!}" />
                </div>

            </div>
        </div>
    </div>

</@layout>
